new Vue({
    el: '#app',
    data() {
        return {
            SkuData: [], //skudata
            Specs: "", //添加的规格值
            attribute: "", //添加的参数值
            checkedAttr: [], //勾选详情
            SpecsList: [
                // { key: '颜色', value: ["黑", "白"], checkedAttr: [] },
                // { key: '尺寸', value: ["14寸", "15寸"], checkedAttr: [] },
                // { key: '储存盘', value: ["固态", "机械"], checkedAttr: [] },
            ], //规格详情
            spanArr: [],
            operationData: [
                {price: "", sellprice: "", stock: ""}
            ],
            selected: '',
            optionList: [
                {id: 11, name: '分类1'},
                {id: 22, name: '分类2'},
                {id: 33, name: '分类3'}
            ],
            types:0,//属性类型
        }
    },
    //进入页面加载
    created() {
        this.getAttr();  //获取属性类型
    },
    computed: {
        table() {
            var data = this.SkuData;
            var dd = '';
            for (var i = 0; i < data.length; i++) {

                dd += JSON.stringify(data[i]) + "_";
                // dd = data.splice(0, 3);
            }
            //去掉最后一个逗号(如果不需要去掉，就不用写)
            if (dd.length > 0) {
                dd = dd.substr(0, dd.length - 1);
            }
            console.log(data, '=========>data<');
            console.log(dd, '=========>dd<');
            return dd
        },
        type(){
            var type = this.types;
            if (type == ''){
                type =0;
            }
            return type;
        }
    },
    watch: {
        SkuData(newVal, oldVal) {
            // this.getSpanArr(newVal)
        }

    },
    methods: {
        //属性类型
        getAttr: function () {
            $.ajax({
                type: 'post',
                url: "goods_attr",
                data: '',
                success: (data) => {
                    // console.log('规格类型', data)
                    if (data.code == 200) {
                        this.optionList = data.result;
                    }
                }
            });
        },
        //获取商品属性
        selectType(data) {
            $.ajax({
                type: 'post',
                url: 'get_attr',
                data: {type: data},
                success: (res) => {
                    // console.log('请求返回的属性详情res', res);
                    if (res.code == 200) {
                        this.SpecsList = res.result;
                    }
                    //  console.log('现在的属性详情',this.SpecsList);
                }
            });
            this.types = data;
            // console.log(data,'====这是啥1');
        },
        //end
        //添加规格
        // addSpecs() {
        //     var that = this;
        //     var val = that.Specs;
        //     var list = that.SpecsList;
        //     if (val) {
        //         if (list.length > 0) {
        //             for (var i = 0; i < list.length; i++) {
        //                 if (list[i].key == val) {
        //                     alert('名称重复')
        //                     that.Specs = '';
        //                     return
        //                 }
        //             }
        //             list.push({
        //                 "key": val,
        //                 "value": [],
        //                 "checkedAttr": []
        //             })
        //             that.Specs = '';
        //         } else {
        //             list.push({
        //                 "key": val,
        //                 "value": [],
        //                 "checkedAttr": []
        //             })
        //             that.Specs = '';
        //         }
        //     } else {
        //         alert('不能为空')
        //     }
        //     that.SpecsList = list;
        // },
        //添加参数
        // addAttribute(value, i) {
        //     console.log(this.attribute)
        //     var list = this.SpecsList[i].value;
        //     if (this.attribute) {
        //         if (list.indexOf(this.attribute) != -1) {
        //             return alert("已存在")
        //         } else {
        //             this.SpecsList[i].value.push(this.attribute);
        //         }
        //     } else {
        //         alert("不能为空")
        //     }
        //     console.log(this.SpecsList)
        //     this.attribute = ''
        // },
        //勾选参数
        checkboxChange() {
            var that = this;
            var SpecsList = that.SpecsList;
            //   console.log(SpecsList,'=================>勾选参数 ---  SpecsList<');
            var attrArr = [];

            for (var i = 0; i < SpecsList.length; i++) {
                if (SpecsList[i].checkedAttr.length > 0) {

                    var key = SpecsList[i].key;


                    var arrt3 = [];
                    for (var j = 0; j < SpecsList[i].checkedAttr.length; j++) {
                        var v_id = SpecsList[i].checkedAttr[j];
                        var name = SpecsList[i].value[v_id].name;
                        //  attr3['id']=v_id;
                        //  attr3['name']=name
                        arrt3.push(name);
                    }

                    var obj = {
                        'key': key,
                        'id': SpecsList[i].id,
                        //  "value": SpecsList[i].checkedAttr,  //数组
                        "value": SpecsList[i].checkedAttr,  //数组
                        "name": arrt3,  //数组
                    }
                    attrArr.push(obj);

                }
            }
            ;

            console.log(attrArr, '=================>attrArr<');

            that.checkedAttr = attrArr; //动态赋值
            if (attrArr.length > 0) {
                that.setTableData(attrArr)
            }
        },
        //表格数据处理
        setTableData(attrArr) {
            var that = this;
            let list = attrArr;
            console.log(list, '=====================>表格数据处理 ---   list<');
            const reducer = (accumulator, currentValue) => {
                var data = [];

                console.log(accumulator, '=====================>accumulator  1<')
                console.log(currentValue, '=====================>currentValue  2<')
                console.log(accumulator.length, '===================accumulator.length');
                if (accumulator.length) {
                    accumulator.forEach(element => {

                        currentValue.name.forEach(value => {
                            let obj = {};
                            for (var el in element) {
                                // console.log(el + "...." + element[el]);
                                let key = currentValue.key;
                                obj['price'] = '';
                                obj['sellprice'] = '';
                                obj['stock'] = '';
                                obj[key] = value;
                                obj[el] = element[el];

                            }

                            data.push(obj)
                        })
                    })
                } else {
                    accumulator.name.forEach(el => {
                        currentValue.name.forEach(value => {
                            let obj = {};
                            let key = accumulator.key;
                            obj['price'] = '';
                            obj['sellprice'] = '';
                            obj['stock'] = '';
                            obj[key] = el;
                            let key1 = currentValue.key;
                            obj[key1] = value;

                            data.push(obj)
                        })
                    })
                }
                console.log(data, '===================>data111111<');
                return that.SkuData = data
            };
            if (list.length == 1) {
                // console.log(list);
                var data = [];

                for (var i = 0; i < list[0].name.length; i++) {
                    var obj = {};
                    obj['price'] = '';
                    obj['sellprice'] = '';
                    obj['stock'] = '';
                    var key = list[0].key;
                    //   obj[key] = list[0].value[i];
                    obj[key] = list[0].name[i];


                    data.push(obj)
                }

                that.SkuData = data
            } else {
                that.SkuData = list.reduce(reducer);
            }
        },

    }

})